<!DOCTYPE html>
<style>
.container {
    position: absolute;
    top: 25px;
    width: 100px;
    height: 100px;
    border: 1px dashed black;
    overflow: hidden;
}

.scroller {
    transform-origin: 0 0;
    width: 100px;
    height: 100px;
    overflow: scroll;
}

.bloat {
    width: 150px;
    height: 150px;
    background: green;
}
</style>
<div class="container" style="left:25px;">
    <div class="scroller" style="transform:translate3d(0, 1px, 0)scale(1.5);">
        <div class="bloat"></div>
    </div>
</div>
<div class="container" style="left:175px;">
    <div class="scroller" style="transform:translate3d(0, 1.25px, 0)scale(1.5);">
        <div class="bloat"></div>
    </div>
</div>
<div class="container" style="left:325px;">
    <div class="scroller" style="transform:translate3d(0, 1.5px, 0)scale(1.5);">
        <div class="bloat"></div>
    </div>
</div>
<div class="container" style="left:475px;">
    <div class="scroller" style="transform:translate3d(0, 1.75px, 0)scale(1.5);">
        <div class="bloat"></div>
    </div>
</div>
This test verifies composited scrollers have consistent clip rect regardless of current scroll offset.
<script>
for (elem of document.getElementsByClassName("scroller"))
    elem.scrollTop = 1;
</script>